<template>
  <div>
    <el-dialog title="新增目录" :visible.sync="dialogFormVisible" width="30%" >
        <el-form :model="tag" ref="dataForm" :rules="rules">
            <!-- <el-form-item label="所属学科" v-if='this.tag.subjectID != null' prop="subjectName">
            <el-input v-model="tag.subjectName" autocomplete="off"></el-input>
            </el-form-item> -->

             <!-- <el-select  v-if='this.tag.subjectID != null' v-model="tag.subjectName" prop="subjectName" placeholder="请选择所属学科" >
                <el-option v-for="item in data" :key='item.value' :value="item.value" :label="item.label">

                </el-option>
             </el-select> -->
             <el-form-item label="所属学科" v-if="subID ? 0 : 1" prop="subjectID">
              <el-select v-model="tag.subjectID" class="formDialogSelect" placeholder="请选择所属学科" >
                <el-option v-for="item in data" :key='item.value' :value="item.value" :label="item.label">
                </el-option>
             </el-select>
            </el-form-item>

            <el-form-item label="标签名称" prop="tagName" >
            <el-input v-model="tag.tagName" class="formDialogInput" autocomplete="off"></el-input>
            </el-form-item>
        </el-form>
        <div slot="footer" class="dialog-footer">
            <el-button @click="dialogFormVisible = false">取 消</el-button>
            <el-button type="primary" @click="hConfirm">确 定</el-button>
        </div>
        </el-dialog>
  </div>
</template>

<script>
import { simple } from '@/api/hmmm/subjects'
import { update, add } from '@/api/hmmm/tags'
export default {
  name: 'tag-add',
  props: {
    //  接受需要修改的学科信息]
    subID: {
      type: Number
    },
    tag: {
      type: Object,
      require: true
    }
  },
  data () {
    return {
      dialogFormVisible: false,
      formLabelWidth: '120px',
      // subjectID: null,
      // subjectName: '',
      rules: {
        tagName: [{ required: true, message: '所属标签不能为空' }],
        subjectName: [{ required: true, message: '学科名称不能为空', trigger: 'change' }]
      },
      data: [],
      addcanshu: {
        subjectID: '',
        tagName: ''
      }
    }
  },
  async created () {
    const result = await simple()
    console.log('simple', result)
    this.data = result.data
  },
  methods: {
    dialogFormV () {
      this.dialogFormVisible = true
    },
    // 弹层隐藏
    dialogFormH () {
      this.dialogFormVisible = false
    },
    // 提交表单
    // dialogFormVisible = false
    // 可能是添加也可能是新增
    hConfirm () {
    // 1.校验
      this.$refs.dataForm.validate(valid => {
        if (valid) {
          // console.log(111, this.tag)
          this.dohConfirm()
        }
      })
    },
    // 校验完成后
    async dohConfirm () {
      try {
        if (this.tag.id) {
          await update(this.tag)
          this.$emit('modify', this.tag)
          this.$message.success('修改成功')
        } else {
          // this.tag.subjectID = 1
          // console.log(111)
          await add(this.tag)
          //   console.log(result)
          this.$emit('addmodify', this.tag)
        }
        this.dialogFormH()
      } catch (err) {
        console.log(err)
      }
    }
  }
}
</script>

<style>
  .formDialogInput,
  .formDialogSelect{
    width: 250px;
    margin-bottom: 10px;
  }
</style>
